<script setup lang="ts">
import { useRouter } from 'vue-router'
const router = useRouter()

const props = defineProps({
    cardcont:Array
})
const {cardcont} = props as any

</script>
<template>
    <div>

        <el-card class="box-card dflex" v-for="item in cardcont[0]" :key="item"
            @click.stop="router.push({ path: `/dynamic/${item.a_id}` })">
            <div>
                <h3>{{ item.a_title }}</h3>
                <div> {{ item.a_abstract }} </div>
                <el-space  >{{ item.a_date }} </el-space>
                <!-- <el-space :size="30">{{ item.ds_name }} </el-space> -->
            </div>
            <div v-if="item.a_cover !== ''" class="image">
                <el-image style=" height: 100px;width: 150px;   object-fit: cover;" :src="item.a_cover" />
            </div>
        </el-card>
</div>
</template>
    
<style lang="scss" scoped>
.el-tag {
    margin-right: 25px;
}

.btn {
    color: #fff;
}

.dflex {
    margin: 10px auto;
    cursor: pointer;
    :deep(.el-card__body) {
        display: flex;

        :nth-child(1) {
            margin-right: 5px;
            * {
                margin-bottom: 5px;
            }
        }
    }

}
@media only screen and (max-width: 600px) {

    .dflex {
    margin: 10px auto;

    :deep(.el-card__body) {
        display: block;

        :nth-child(1) {
            * {
                margin-bottom: 5px;
            }
        }
    }

}
}

</style>
